
/**
 * 
 * ajax是一个独立的技术，
 * 
* @description
*/
// XML -  Http - Request 
// xhr.onreadystatechange=()=>{
//   //readyState 0:初始化请求 1:建立连接 2:请求发送成功 3:服务器接收你的请求并处理  4: 服务器返回数据，结束响应
//   if(xhr.readyState ===4){
//       //status  状态   200  成功
//       if(xhr.status===200){
//           //xhr.responseText  服务端给你返回的数据
//           // console.log(xhr.responseText)
//       }
//   }
// }
/**
 * 
 * @param {请求方式 get post} method 
 * @param {请求路径} url 
 * @param {请求回调函数} callback 
 */

function ajax(method, url, callback) {
  // 1.实例化 对象
  let xhr = new XMLHttpRequest();
  //2.打开请求
  //第一个参数表示请求方式,值为get/post,是字符串
  //第二个参数表示请求的地址
  //第三个参数是布尔值,默认是true表示异步,false表示同步
  xhr.open(method, url) // 第三个参数不写默认异步
  //3.发送数据(post方式必须发送请求头)
  xhr.send() // get方式不穿参数  post方式传参数
  // 4.操作返回的数据s
  xhr.onreadystatechange = () => {
    if (xhr.readyState === 4) {
      if (xhr.status === 200) {
        callback(JSON.parse(xhr.responseText))
        console.log(JSON.parse(xhr.responseText), 'v---v')
      }
    }
  }
}

// 异步的js和xml  凡是异步的代码都可以用promise封装
// function axios(method, url) {
//   return new Promise((resolve, reject) => {
//     let xhr = new XMLHttpRequest();
//     xhr.open(method, url) // 第三个参数不写默认异步
//     xhr.send() // get方式不穿参数  post方式传参数
//     xhr.onreadystatechange = () => {
//       if (xhr.readyState === 4) {
//         if (xhr.status === 200) {
//           resolve(JSON.parse(xhr.responseText))
//         } else {
//           reject(new Error('请求失败了'))
//         }
//       }
//     }
//   })
// }

// axios get post
const axios = {
  xhr: null,
  init() {
    this.xhr = new XMLHttpRequest();
  },
  get(url) {
    return new Promise((resolve, reject) => {
      this.init()
      this.xhr.open('get', url) // 第三个参数不写默认异步
      this.xhr.send() // get方式不穿参数  post方式传参数
      this.readfn(resolve, reject);
    })
  },
  post(url) {
    return new Promise((resolve, reject) => {
      this.init()
      this.xhr.open('post', url) // 第三个参数不写默认异步
      this.xhr.send() // post方式传参数  name=devin&age=18
      this.xhr.setRequestHeader("content-type", "application/json")
      this.readfn(resolve, reject);
    })
  },
  readfn(resolve, reject) {
    this.xhr.onreadystatechange = () => {
      if (this.xhr.readyState === 4) {
        if (this.xhr.status === 200) {
          console.log(JSON.parse(this.xhr.responseText))
          resolve(JSON.parse(this.xhr.responseText))
        } else {
          reject(new Error('请求失败了'))
        }
      }
    }
  },
  params() {

  }
}


